<!-- 首页 -->
<template>
	<view class="page">
		<mescroll-uni ref="mescrollTopicRef" @init="mescrollInit" @down="downCallback" :up="upOption" @up="upCallback">
			<view :style="{paddingTop: CustomBar + 'px'}"></view>
			<talk-list @menu="menu" @more="more" @thumb="thumb" @chat="chat" :dataList="dataList"></talk-list>
		</mescroll-uni>
	</view>
</template>

<script>
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
import MescrollMoreItemMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-more-item.js";
import {mapState} from 'vuex'
export default {
	mixins: [MescrollMixin,MescrollMoreItemMixin], // 注意此处还需使用MescrollMoreItemMixin (必须写在MescrollMixin后面)
	props: {
		topicId: {
			type: String,
			default: ''
		},
	},
	data() {
		return {
			CustomBar: this.CustomBar,
			upOption:{
				auto:false, // 不自动加载
				page: {
				 	num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
				 	size: 20 // 每页数据的数量
				},
				noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
				empty:{
			        icon: '/static/mescroll-empty.png',
					tip: '~ 暂无数据 ~', // 提示
					// btnText: '去看看'
				},
				toTop: {
					right: 40,
					width: 80,
					bottom: 200,
				},
			    textNoMore:'没有更多了'
			},
			dataList: [],
		};
	},
	computed: {
		...mapState(['vuex_user']),
	},
	methods: {
		downCallback(mescroll) {
			mescroll.endSuccess();
			mescroll.resetUpScroll();
		},
		async upCallback(mescroll) {
			var userId = uni.getStorageSync("userId");
			this.$u.get('/wq/dynamic/list',{
				topicIds: this.topicId,
				orderBy: 'hot',
				pageNum: mescroll.num,
				appId: this.website.appId,
				pageSize: mescroll.size,
				userId: userId,
				lon: this.vuex_user.lon,
				lat: this.vuex_user.lat,
			}).then(res => {
				mescroll.endSuccess(res.rows.length);
				if (mescroll.num == 1) {
					this.dataList = res.rows;
				} else {
					this.dataList = this.dataList.concat(res.rows);
				}
			}).catch(err => {
				mescroll.endErr();
			});
		},
		menu(e) {
			this.$emit('menu', e);
		},
		clickSheet(sheet) {
			if('remove' == sheet.tag){
				this.deleteTopic(sheet.id);
			}
		},
		deleteTopic(id) {
			this.$u.get('/wq/dynamic/delete',{
				id: id,
			}).then(res => {
				this.reload();
			})
		},
		thumb(e,i) {
			this.$u.post('/wq/dynamicGive/add',{
				dynamicId: e.id,
			}).then(res => {
				if(res.data){
					this.dataList[i].giveNum = this.dataList[i].giveNum + 1;
				}else{
					this.dataList[i].giveNum = this.dataList[i].giveNum - 1;
				}
			});
		},
		chat(e) {
			this.$u.route({
				url: 'packgeMine/pages/index/dynamic',
				params: {
					dynamicId: e.id,
				}
			});
		},
		more() {
			this.$u.toast('打开');
		},
	}
};
</script>
<style lang="scss" scoped>
	.page {
		background-color: #fff;
	}
	.topic-header {
		padding: 15px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.topic-title {
		font-size: 26rpx;
		font-weight: bolder;
	}
	.topic-more {
		font-size: 24rpx;
		color: #505152bd;
	}
	.loadmore-box {
		padding: 15px 0;
	}
	.top-box {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 10px;
		padding-right: 20px;
	}
	.u-tabs-box {
		width: 100px;
	}
	.dong-tai {
		font-size: 24rpx;
		color: #82848a;
	}
</style>
